<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta http-equiv="Cache-Control"  content="no-transform">
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>商家登陆</title>
    <link href="/statics/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <link href="/statics/view/css/all.css" rel="stylesheet" type="text/css" />
</head>
<body>
<header class="navbar navbar-static-top baoxb-navbar-top" id="top" role="banner">
    <div class="container">
        <div class="navbar-header">
            <#--<button class="navbar-toggle collapsed" type="button" data-toggle="collapse" data-target="#bs-navbar" aria-controls="bs-navbar" aria-expanded="false">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>-->
            <a href="/" class="navbar-brand">报销宝</a>
        </div>
        <nav id="bs-navbar" class="collapse navbar-collapse">
            <ul class="nav navbar-nav">
                <li>
                    <a href="../getting-started/">介绍</a>
                </li>
                <li>
                    <a href="../getting-started/">介绍</a>
                </li>
            </ul>
            <ul class="nav navbar-nav navbar-right">
                <li><a href="http://www.bootcss.com/" onclick="_hmt.push(['_trackEvent', 'docv3-navbar', 'click', 'V3导航-Bootstrap中文网'])" target="_blank">个人中心</a></li>
            </ul>
        </nav>
    </div>
</header>
<div class="container">
    <div class="row" style="margin-top: 180px;">
        <div class="col-md-5">
            <div class="panel" style="padding: 0 30px;">
                <div class="panel-body">
                    <form id="loginForm" action="/loginSubmit">
                        <div class="form-group">
                            <label>用户名</label>
                            <input type="text" name="username" id="username" class="form-control"  placeholder="用户名/手机号">
                        </div>
                        <div class="form-group">
                            <label>密码</label>
                            <input type="password" name="password" id="password" class="form-control"  placeholder="6-16位密码">
                        </div>
                        <div class="form-group">
                            <label for="code">验证码</label>
                            <div class="input-group">
                                <input type="text" class="form-control captcha" id="captcha"  name="captcha" maxlength="4" autocomplete="off" placeholder="验证码" style="width: 70%;">
                                <img id="captchaImage" class="captchaImage" src="/common/captcha.do?captchaId=${captchaId}" title="验证码" style="width:25%;height: 34px;margin-left: 5px;"/>
                            </div>
                        </div>
                        <div class="checkbox">
                            <label>
                                <input type="checkbox">30填自动登陆
                            </label>
                        </div>
                        <button type="submit" class="btn btn-primary">登陆</button>
                    </form>
                </div>
            </div>
        </div>
        <div class="col-md-6">

        </div>
    </div>
</div>
<script type="text/javascript" src="/statics/jquery/jquery.js"></script>
<script type="text/javascript" src="/statics/view/js/jquery.validate.js"></script>
<script type="text/javascript" src="/statics/view/js/jsbn.js"></script>
<script type="text/javascript" src="/statics/view/js/prng4.js"></script>
<script type="text/javascript" src="/statics/view/js/rng.js"></script>
<script type="text/javascript" src="/statics/view/js/rsa.js"></script>
<script type="text/javascript" src="/statics/view/js/base64.js"></script>
<script type="text/javascript" src="/statics/layer/layer.js"></script>
<script type="text/javascript">
    $().ready(function() {
        var $loginForm = $("#loginForm");
        var $username = $("#username");
        var $password = $("#password");
        var $captcha = $("#captcha");
        var $captchaImage = $("#captchaImage");
        var $submit = $(":submit");
        // 更换验证码
        $captchaImage.click(function() {
            $captchaImage.attr("src", "/common/captcha.do?captchaId=${captchaId}&timestamp=" + (new Date()).valueOf());
        });
        // 表单验证
        $loginForm.validate({
            rules: {
                username: "required",
                password: "required",
                captcha: "required"
            },
            submitHandler: function(form) {
                layer.load(0, {
                    shade: [0.7,'#333'] //0.1透明度的白色背景
                });
                $.ajax({
                    url: "/common/public_key.do",
                    type: "GET",
                    dataType: "json",
                    cache: false,
                    success: function(data) {
                        var rsaKey = new RSAKey();
                        rsaKey.setPublic(b64tohex(data.modulus), b64tohex(data.exponent));
                        var enPassword = hex2b64(rsaKey.encrypt($password.val()));
                        $.ajax({
                            url: $loginForm.attr("action"),
                            type: "POST",
                            data: {
                                username: $username.val(),
                                enPassword: enPassword,
                                captchaId: "${captchaId}",
                                captcha: $captcha.val()
                            },
                            dataType: "json",
                            cache: false,
                            success: function(message) {
                                layer.closeAll('loading');
                                $submit.prop("disabled", false);
                                if (message.type == "success") {
                                    /*[#if redirectUrl??]
                                         location.href = "${redirectUrl}";
                                    [#else]
                                        location.href = "/bCenter/main";
                                    [/#if]*/
                                    location.href = "/bCenter/main";
                                } else {
                                    layer.msg(message.content);
                                    $captcha.val("");
                                    $captchaImage.attr("src", "/common/captcha.do?captchaId=${captchaId}&timestamp=" + (new Date()).valueOf());
                                }
                            },
                            error:function(){
                                layer.closeAll('loading');
                                layer.msg("服务器错误");
                            }
                        });
                    }
                });
            }
        });
    });
</script>
</body>
</html>